import React from 'react'
import { Table,Tabs,message,Button,Modal,Form,Input,Space} from 'antd';
import {reqAdmincheckValue,reqAdminVerify,reqAdminRuRefuse} from '../../api/index'
import './index.css'
import { compose } from 'redux';
class Repair extends React.Component{
    constructor(props){
        super(props)
        this.state ={
            ogoodsId:null,
            data1:[],
            data2:[],
            processingResults:null,
            // inputValue1:'',
            // inputValue2:'',
            visible1:false,
            visible2:false,
        }
    this.callback = this.callback.bind(this)
    this.onFinish = this.onFinish.bind(this)
    this.handleCancel = this.handleCancel.bind(this)
    this.handleclick = this.handleclick.bind(this)
    this.handleRefuse = this.handleRefuse.bind(this)
    }
    handleCancel(){
      console.log('Clicked cancel button');
      this.setState({visible1:false});
      this.setState({visible2:false});
    };
    handleRefuse(params){
      reqAdminRuRefuse(params).then(res=>{
        console.log(res)
        if(res.code === 0){
          this.setState({data1:[]})
            reqAdmincheckValue().then(res=>{
              console.log(res)//对数据进行处理然后展示
              this.setState({data1:res.data})
            })
          setTimeout(()=>{
            message.success('拒绝入库申请成功！')
          },500)
        }
      })
    }
    componentDidMount(){
      reqAdmincheckValue().then(res=>{
        console.log(res)//对数据进行处理然后展示
        this.setState({data1:res.data})
      })
    }
    onFinish(values){//分配存储地址
      const data = {
        roomNumber:values.roomNumber,
        shelfNumber:values.shelfNumber,
        goodsId:this.state.ogoodsId
      }
      reqAdminVerify(data).then(res=>{
        console.log(res.code)
        if(res.code == 0){
          console.log(res)
          this.setState({visible1:false});
          message.success('分配存储地址成功！')
          setTimeout(() => {
            this.setState({data1:[]})
            reqAdmincheckValue().then(res=>{
              console.log(res)//对数据进行处理然后展示
              this.setState({data1:res.data})
            })
          },500);
        }else{
          message.error('分配地址失败，请重新分配')
        }
      })
      console.log(data)
    }
    callback(key) {
      console.log(key);
    }
    changeTypes(e){
        switch (e) {
            case 0:
                return '未处理';
            case 1:
                return '进行中';
            case 2:
                return '已完成';
            case 3:
                return '处理失败';
        }
    }
    handleclick(e){//填入审批数据之后 拿到的id
      console.log(e.goodsId)
      this.setState({ogoodsId:e.goodsId})
      this.setState({visible1:true});
    }
    handleClikk(e){
      console.log(e.goodsId)
      this.setState({data2:[]})
      reqAdmincheckValue().then(res=>{
        console.log(res)//对数据进行处理然后展示
        res.data.map((item,index)=>{
          if(item.goodsId === e.goodsId){
            this.setState({data2:item.goodsInfoList})
          }
        })
      })
      this.setState({visible2:true});
    }
    render(){
        const { TextArea } = Input;
        const { TabPane } = Tabs;
        const columns2 = [
          {
            title: '物品名称',
            dataIndex: 'goodsName',
            key: 'goodsName',
            render: text => <a>{text}</a>,
          },
          {
            title: '物品数量',
            dataIndex: 'goodsNum',
            key: 'goodsNum',
          },
          {
            title: '物品规格(L/kg)',
            dataIndex: 'goodsWeight',
            key: 'goodsWeight',
          },
        ];
        const columns1 = [
            {
              title: '物品ID',
              dataIndex: 'goodsId',
              key: 'goodsId',
              render: text => <a>{text}</a>,
            },
            {
              title: '经办人姓名',
              dataIndex: 'agentName',
              key: 'agentName',
            },
            {
              title: '经办人电话',
              dataIndex: 'agentPhone',
              key: 'agentPhone',
            },
            {
              title: '负责人姓名',
              dataIndex: 'chargeName',
              key: 'chargeName',
            },
            {
              title: '负责人电话',
              dataIndex: 'chargePhone',
              key: 'chargePhone',
            },
            {
              title:'所在院',
              dataIndex: 'college',
              key: 'college',
            },
            {
              title:'申请时间',
              dataIndex: 'applicationTime',
              key: 'applicationTime',
            },
            {
              title: '审批操作',
              key: 'action',
              render: (text, record) => (
                <Space size="middle">
                  <Button onClick={()=>{
                      const param = {
                        goodsId:record.goodsId,
                      }
                      this.handleClikk(param)
                  }} type='primary'>查看详情</Button>
                  <Button onClick={()=>{
                      const params = {
                        goodsId:record.goodsId,
                      }
                      this.handleclick(params)
                  }} type='primary'>通过</Button>
                   <Button onClick={()=>{
                      const params = {
                        goodsId:record.goodsId,
                      }
                      this.handleRefuse(params)
                  }} type='primary' danger>拒绝</Button>
                </Space>
              ),
            },
          ];
         
          const data1 = this.state.data1;
          const data2 = this.state.data2
          const layout = {
            labelCol: {
              span: 8,
            },
            wrapperCol: {
              span: 16,
            },
          };
          // const data1 = [{
          //   id: 1,
          //   repairType: "水电"
          // },{
          //   id: 2,
          //   repairType: "网络"
          // }]
          // const data2 =[{
          //   index: 1,
          //   typeName: "维修"
          // },{
          //   index: 2,
          //   typeName: "加水"
          // }]
        return(<div>
              <Table className="tableOne" columns={columns1} dataSource={data1} />
          <Modal
          title="分配存储地址"
          visible={this.state.visible1}
          onCancel={this.handleCancel}
          footer=''
        >
                <Form  className="formItem"
                {...layout}
                name="basic"
                initialValues={{
                    remember: true,
                }}
                onFinish={this.onFinish}
                >
                <Form.Item
                        label="房间号"
                        name="roomNumber"
                        rules={[
                        {
                            required: true,
                            message: '请输入存储具体地址!',
                        },
                        ]}
                    >
                        <TextArea showCount maxLength={100}  />
                    </Form.Item>                  
                    <Form.Item
                        label="货架号"
                        name="shelfNumber"
                        rules={[
                        {
                            required: true,
                            message: '请输入存储具体地址!',
                        },
                        ]}
                    >
                        <TextArea showCount maxLength={100}  />
                    </Form.Item>
                    <Form.Item className="buttonStyle">
                        <Button type="primary" htmlType="submit">
                            确定
                        </Button>
                    </Form.Item>
                </Form>
        </Modal>
        <Modal
          title="危险品详情"
          visible={this.state.visible2}
          onCancel={this.handleCancel}
          footer=''
        >
          <Table className="tableOne" columns={columns2} dataSource={data2} />
        </Modal>
        </div>)
    }
}
export default Repair